<template>
  <el-dialog :close-on-click-modal="false" title="联系人" :visible.sync="dialogVisible" width="800px">
    <div style="overflow: hidden">
      <el-table ref="productTable"
                :data="list"
                style="width: 100%;font-size: 12px;"
                v-loading="listLoading"
                border>
        <el-table-column
          label="公司名称"
          width="300">
          <template slot-scope="scope">
              {{scope.row.customerName}}
          </template>
        </el-table-column>
        <el-table-column
          prop="contactName"
          label="联系人姓名"
          width="100">
        </el-table-column>
        <el-table-column
          prop="contactMobile"
          label="联系方式"
          align="center"
          width="180">
        </el-table-column>
        <el-table-column
          label="是否为主联系人"
          align="center"
          width="150">
          <template slot-scope="scope">
            {{scope.row.isMainContact == 1 ? '是' : '否'}}
          </template>
        </el-table-column>
        <el-table-column
          label="是否有采购决定权"
          align="center"
          width="150">
          <template slot-scope="scope">
            {{scope.row.isBuyPermission == 1 ? '是' : '否'}}
          </template>
        </el-table-column>
        <el-table-column
          prop="lastTrackingTime"
          label="最近联系日期"
          width="150"
          align="center">
          <template slot-scope="scope">
            {{scope.row.lastTrackingTime | formatTime}}
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="goodsLineNames"
          label="产品线"
          width="150">
        </el-table-column>
        <el-table-column
          show-overflow-tooltip
          prop="contactFocus"
          label="关注点"
          width="150">
        </el-table-column>
        <el-table-column
          show-overflow-tooltip
          label="爱好"
          width="150">
          <template slot-scope="scope">
            {{scope.row.contactHobby}}
          </template>
        </el-table-column>
        <el-table-column
          label="创建日期"
          width="150"
          align="center">
          <template slot-scope="scope">
            {{scope.row.createdAt}}
          </template>
        </el-table-column>
        <el-table-column
          label="创建人"
          width="100"
          align="center">
          <template slot-scope="scope">
            {{scope.row.createUserName}}
          </template>
        </el-table-column>
      </el-table>
      <div class="pagination-container">
        <el-pagination
          background
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          layout="total, sizes,prev, pager, next,jumper"
          :page-size="listQuery.pageSize"
          :page-sizes="[10,15,20]"
          :current-page.sync="listQuery.pageNum"
          :total="count">
        </el-pagination>
      </div>
    </div>
  </el-dialog>
</template>
<script>
import {getOrderUsersList,getContactPageList} from '@/api/partner'
import {planGoodsListScheduled,} from '@/api/order'
import {formatDate} from '@/utils/date';

import store from '@/store'
import { mapGetters } from 'vuex'

const defaultListQuery={
  pageNum:1,
  pageSize:10,
  customerId:'',
  contactName:'',
  contactMobile:'',
  createTime:null,
  updateTime:null,
  trackingTime:null,
  goodsLineId:'',
  cglId:'',
  type:'all',
  isMy:1,
};


export default {
  name: "index",
  data(){
    return {
      listQuery: JSON.parse(JSON.stringify(defaultListQuery)),
      count: 0,
      listLoading: false,
      list:[],
      dialogVisible:false
    }
  },
  computed: {
    ...mapGetters([
      'name',
      'mobile',
      'userId'
    ]),
  },
  components : {

  },
  created() {

  },
  filters: {
    formatTime(time) {
      if(time){
        let date = new Date(time);
        return formatDate(date, 'yyyy-MM-dd hh:mm:ss')
      }else{
        return ''
      }

    },
  },
  methods:{

    //显示
    showPop(item,type){
        this.dialogVisible = true;
        if(type == 'customer'){
          this.listQuery.customerId = item.customerId
        }else{
          this.listQuery.cglId = item.cglId
        }
        this.getList()
    },


    handleSizeChange(val){
      this.listQuery.pageNum = 1;
      this.listQuery.pageSize = val;
      this.getList();
    },
    handleCurrentChange(val){
      this.listQuery.pageNum = val;
      this.getList();
    },

    handleSearchList(){
      this.listQuery.pageNum = 1;
      this.getList();
    },
    //获取列表
    getList() {
      this.listLoading = true;
      getContactPageList(this.listQuery).then(response => {
        this.list = response.list;
        this.count = response.count;
        this.listLoading = false;
      }).catch(()=>{
        this.listLoading = false;
      });
    },

  },
}
</script>

<style  lang="scss">

</style>
